/* 背景色 */
.bg {
	background-color: #f9fcfe;
}

.listBg {
	background: url('@/static/img/openLive/listBg.png') no-repeat;
}

.all {
	background-color: #f5f7fb;
	height: 100vh;
	// width: 100vw;
}

.box-s{
	box-shadow: 1px 2px 10px  rgba(20, 111, 255, 0.1);
}

.closeBox {
	background: rgba(20, 111, 255, 1);
	border-radius: 32rpx;
	color: #fff;
	font-size: 26rpx;
	padding: 6rpx 12rpx;
}

/* 颜色 */
.c999 {
	color: #999999;
}

.c000 {
	color: #000000;
}

.cfff {
	color: #FFFFFF;
}

.cooo {
	color: #ff7034;
}

.cblue {
	color: #4978f2;
}


.fs24Ci {
	font-size: 24rpx;
	color: #a5a5a5;
	font-weight: 500;
}

.fs26Ci {
	font-size: 26rpx;
	color: #a5a5a5;
	font-weight: 500;
}

.fs28Ci {
	font-size: 28rpx;
	color: #969696;
	font-weight: 500;
}

/* 字体 */
.fs40 {
	font-size: 40rpx;
}

.fs36 {
	font-size: 36rpx;
}

.fs32 {
	font-size: 32rpx;
}

.fs30 {
	font-size: 30rpx;
}

.fs28 {
	font-size: 28rpx;
}

.fs26 {
	font-size: 26rpx;
}

.fw5 {
	font-weight: 500;
}

.fw6 {
	font-weight: 600;
}

.bold {
	font-weight: bold;
}

.fs36b {
	font-size: 36rpx;
	font-weight: bold;
}

.fs34b {
	font-size: 34rpx;
	font-weight: bold;
}

.fs32b {
	font-size: 32rpx;
	font-weight: bold;
}

.fs30b {
	font-size: 30rpx;
	font-weight: bold;
}

.fs28b {
	font-size: 28rpx;
	font-weight: bold;
}

.fs26b {
	font-size: 26rpx;
	font-weight: bold;
}

/* 布局 */
/* flex布局 */
.df {
	display: flex;
	justify-content: space-between;
}

.dfx {
	display: flex;
}

.jb {
	justify-content: space-between;
}

.flex {
	display: flex;
}

.alc {
	align-items: center;
}

.space {
	justify-content: space-evenly;
}

.around {
	justify-content: space-around;
}

.center {
	justify-content: center;
}



.flex.start {
	justify-content: flex-start;
}

.flex.end {
	justify-content: flex-end;
}

.wrap {
	flex-direction: row;
	flex-wrap: wrap;
}

/* 内外边距 */
.pb10 {
	padding-bottom: 20rpx;
}

.mg30{
	margin: 30rpx;
}

.mgAuto {
	margin: 0 auto;
}

.mglr20 {
	margin: 0 40rpx;
}

.mglr10 {
	margin: 0 20rpx;
}

.mtb20 {
	margin: 20rpx 0;
}

.mtb10 {
	margin: 10rpx 0;
}

.mt10 {
	margin-top: 10rpx;
}

.mt16 {
	margin-top: 16rpx;
}

.mt20 {
	margin-top: 20rpx;
}

.mt45 {
	margin-top: 45rpx;
}

.mr16 {
	margin-right: 16rpx;
}

.mt10 {
	margin-top: 10rpx;
}

.mt15 {
	margin-top: 15rpx;
}

.mt20 {
	margin-top: 20rpx !important;
}

.mt30 {
	margin-top: 30rpx !important;
}

.mt40 {
	margin-top: 40rpx;
}

.mt50 {
	margin-top: 50rpx;
}

.mt60 {
	margin-top: 60rpx;
}

.mt80 {
	margin-top: 80rpx;
}

.mt240 {
	margin-top: 240rpx;
}

.mb0 {
	margin-bottom: 0rpx !important;
}

.mb10 {
	margin-bottom: 10rpx;
}

.mb15 {
	margin-bottom: 15rpx;
}

.mb20 {
	margin-bottom: 20rpx;
}

.mb30 {
	margin-bottom: 30rpx;
}

.mb40 {
	margin-bottom: 40rpx;
}

.mb50 {
	margin-bottom: 50rpx;
}

.mb60 {
	margin-bottom: 60rpx;
}

.mlr30 {
	margin: 0 30rpx;
}

.ml27vw {
	margin-left: 27vw;
}

.ml10 {
	margin-left: 10rpx;
}

.ml15 {
	margin-left: 15rpx;
}

.ml20 {
	margin-left: 20rpx;
}

.ml30 {
	margin-left: 30rpx;
}

.ml40 {
	margin-left: 40rpx;
}

.ml50 {
	margin-left: 50rpx;
}

.ml60 {
	margin-left: 60rpx;
}

.ml380 {
	margin-left: 380rpx;
}

.mr10 {
	margin-right: 10rpx;
}

.mr15 {
	margin-right: 15rpx;
}

.mr18 {
	margin-right: 18rpx;
}

.mr20 {
	margin-right: 20rpx;
}

.mr30 {
	margin-right: 30rpx;
}

.mr40 {
	margin-right: 40rpx;
}


/* 宽高 */
.wh70 {
	width: 70rpx;
	height: 70rpx;
}

/* 公共标签 */
.type-btn {
	font-size: 22rpx;
	background: linear-gradient(90deg, #fd9c7c, #fe5a35);
	color: #fff;
	font-weight: 800;
	border-radius: 100rpx;
	margin-right: 20rpx;
	padding: 4rpx 14rpx;
}

.type-btn2 {
	font-size: 22rpx;
	background: linear-gradient(90deg, #BE4DFF, #4646FB);
	color: #fff;
	font-weight: 800;
	border-radius: 100rpx;
	margin-right: 20rpx;
	padding: 4rpx 14rpx;
}


/* 文字样式 */
.del {
	text-decoration: line-through;
}

.b-line {
	text-decoration: underline; //下划线
}

.overHidden {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.text-over {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.text-over2 {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.text-over3 {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.text-c {
	text-align: center;
	margin-top: 20rpx;
}

.text-cen {
	text-align: center;
	margin-top: 20rpx;
}

.text-center {
	text-align: center;
}

.text-right {
	text-align: right;
}

.text-line {
	text-decoration: line-through;
}

.text-w {
	color: #FFFFFF;
}

.text-main {
	color: #333333;
}

.text-default {
	color: #000000;
}

.text-info {
	color: #666666;
}

.text-placeholder {
	color: #CCCCCC;
}

.text-notice {
	color: #999999;
}

.text-price {
	color: #FF6D00;
}

.text-load-more {
	color: #ADAEB3;
}

.text-theme {
	color: #FF6D00
}

.text-sign {
	color: #FF4F4E;
}

.text-yellow {
	color: #FF9B20;
}

.text-yellow1 {
	color: #ffc700;
}

.text-plus {
	color: #F2D591;
}

.bg-w {
	background: #FFFFFF;
}

.bg-1 {
	background: #f1f4f9;
}

.bg-default {
	background: #F7F7F7;
}

.bg-main {
	background: #FF6D00;
}

.bg-yellow {
	background: #FFB70E;
}

.bg-yellow1 {
	background: #fff7eb;
}

.bg-orange {
	background: #ff7034;
}

.bg-info {
	background: #fafafa;
}

.bg-info1 {
	background: #f1f5f8;
}

.bg-invite {
	background: #C79A2F;
}

.bg-primary {
	background: #2b75ff;
}

.bg-error {
	background: #fa3534;
}

.bg-warning {
	background: #ff9900;
}

.bg-primary2 {
	background: #f2f7ff;
}


/**一般PADDING需要用到的值,其他的不通用的单独设置**/
.pt10 {
	padding-top: 10rpx;
}

.pt20 {
	padding-top: 20rpx;
}

.pt30 {
	padding-top: 30rpx;
}

.pt40 {
	padding-top: 40rpx;
}

.pt60 {
	padding-top: 60rpx;
}

.pt90 {
	padding-top: 90rpx;
}

.pt100 {
	padding-top: 100rpx;
}

.pt120 {
	padding-top: 120rpx;
}

.pt160 {
	padding-top: 160rpx;
}

.pd10 {
	padding: 10rpx;
}

.pd20 {
	padding: 20rpx;
}

.pd30 {
	padding: 30rpx;
}

.pd40 {
	padding: 40rpx;
}

.plr30 {
	padding: 0rpx 30rpx;
}

.plr40 {
	padding: 0rpx 40rpx;
}

.plr60 {
	padding: 0rpx 60rpx;
}

.pr30 {
	padding-right: 30rpx;
}

.pl20 {
	padding-left: 20rpx;
}

.pl30 {
	padding-left: 30rpx;
}

.pl50 {
	padding-left: 50rpx;
}

.pb20 {
	padding-bottom: 20rpx !important; 
}

.pb30 {
	padding-bottom: 30rpx;
}

.pb40 {
	padding-bottom: 40rpx;
}
.pb60 {
	padding-bottom: 60rpx;
}

/*圆角通用的设置*/
.bdr8 {
	border-radius: 8rpx;
}

.bdr16 {
	border-radius: 16rpx;
}

.bdr32 {
	border-radius: 32rpx;
}

.bdr50 {
	border-radius: 50px;
}

/* 边框 */
.bd1 {
	border: 1px solid #d5d5d8;
}

/*投影设置*/

.box-shadow {
	box-shadow: 0rpx 8rpx 32rpx 0rpx rgba(0, 0, 0, 0.08);
}

.box-shadow-top {
	box-shadow: 0rpx -4rpx 12rpx 0rpx rgba(0, 0, 0, 0.04);
}

.box-shadow-bottom {
	box-shadow: 0rpx 4px 8rpx 0rpx rgba(0, 0, 0, 0.06);
}

/*缩小*/
.scale6 {
	transform: scale(.6);
}

.scale8 {
	transform: scale(.8);
}

/*字体加粗*/
.ftw400 {
	font-weight: 400;
}

.ftw500 {
	font-weight: 500;
}

.ftw600 {
	font-weight: 600;
}

/*商家LOGO*/
.unio2o-store-logo {
	width: 60rpx;
	height: 60rpx;
	box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.06);
	border-radius: 8rpx;
}

/*用户头像*/
.face60 {
	width: 120rpx;
	height: 120rpx;
	border-radius: 60rpx;
}

.face50 {
	width: 100rpx;
	height: 100rpx;
	border-radius: 50rpx;
}

.face80 {
	width: 160rpx;
	height: 160rpx;
	border-radius: 80rpx;
}

.face30 {
	width: 60rpx;
	height: 60rpx;
	border-radius: 30rpx;
}

.face40 {
	width: 80rpx;
	height: 80rpx;
	border-radius: 40rpx;
}

/*宽高设置*/
.wh120 {
	width: 240rpx;
	height: 240rpx;
}

.wh100 {
	width: 200rpx;
	height: 200rpx;
}

.wh80 {
	width: 160rpx;
	height: 160rpx;
}

.h30 {
	height: 30rpx;
}

.h40 {
	height: 40rpx;
}

.h50 {
	height: 50rpx;
}

.w100 {
	width: 100rpx;
}

.w200 {
	width: 200rpx;
}

.w250 {
	width: 250rpx;
}

.vw100 {
	width: 100vw;
}

.wh120 image {
	width: 100%;
	height: 240rpx;
}

.ws120 {
	width: calc(100% - 240rpx);
}

.ws100 {
	width: calc(100% - 200rpx);
}

.w80 {
	width: 160rpx;
}

.ws80 {
	width: calc(100% - 160rpx);
}


.wh30 {
	width: 30rpx;
	height: 30rpx;
}

.wh40 {
	width: 40rpx;
	height: 40rpx;
}

.wh48 {
	width: 48rpx;
	height: 48rpx;
}

.wh60 {
	width: 60rpx;
	height: 60rpx;
}

.wh80 {
	width: 80rpx;
	height: 80rpx;
}

.h100 {
	height: 100%;
}

.lh0 {
	line-height: 0rpx;
}

.line {
	width: 100%;
	height: 2rpx;
	background: #E6E6E6;
}

.dotted_line {
	border: 0;
	border-top: 1px dotted #E6E6E6;
	width: 100%;
}

.dashed_line {
	border: 0;
	border-top: 1px dashed #E6E6E6;
	width: 100%;
}

.opacity5 {
	opacity: .5;
}

.opacity2 {
	opacity: .2;
}

.opacity8 {
	opacity: .8;
}

.empty-img {
	width: 240rpx;
	height: 240rpx;
}

.over-hidden {
	overflow: hidden;
}



/* 列表单行样式 */
.lineBox {
	border-radius: 20rpx;
	padding: 30rpx;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
	background-color: #FFFFFF;
	margin-bottom: 20rpx;
}

/* 页面间隔 */

/* 按钮样式 */
.btn {
	width: 110rpx;
	height: 48rpx;
	border-radius: 8rpx;
	text-align: center;
	line-height: 48rpx;
}

.btn-gz {
	width: 128rpx;
	height: 64rpx;
	border-radius: 8rpx;
	border: 2rpx solid #2b75ff;
	text-align: center;
	line-height: 64rpx;
	color: #FFFFFF;
}

.btn-main {
	width: 100%;
	height: 96rpx;
	background: #2b75ff;
	box-shadow: 0rpx 8rpx 32rpx 0rpx rgba(43, 117, 255, 0.3);
	border-radius: 48rpx;
}